<template>
	<view>
		<!-- <u-skeleton :loading="loading" :animation="true" bgColor="#F8F7FF"></u-skeleton> -->
		<view class="header">
			<view class="myLimit" style="display: flex;">
				<view style="display: flex;align-items: center;justify-content: flex-start;" @click="goInfo">
					<u-avatar
						:src="userInfo['pictureUrl']"
						mode="square"
						size="120"
					></u-avatar>
				</view>
				<view class="headerInfoRight flexCenter">
					<view style="width: 100%;height: 120rpx;">
						<view style="height:50%;width: 100%;display: flex;align-items: center;padding-left: 20rpx;">
							<text style="font-size: 40rpx;font-weight: 500;" >
								{{ userInfo['userName']?userInfo['userName'] : '未登录' }}
							</text>
						</view>
						<!-- <view style="padding-left: 20rpx;color: #bcc5d2;" v-if="userIndex.userInfo">
							<text style="font-size: 30rpx;">账号：{{ userInfo['userName'] }}</text>
						</view> -->
					</view>
					<view class="setting" @click="clickSetting">
						<u-icon name="setting" size="48"></u-icon>
					</view>
				</view>
			</view>
		</view>
		<view class="myLimit">
			<view class="sign">
				<text>填写个人简介，有分享有享念</text>
			</view>
		</view>
		
		<!-- 获赞数等 -->
		<view class="myLimit" style="width: 100%;margin-bottom: 50rpx;">
			<u-row gutter="16">
				<u-col span="4">
					<view class="flexCenter">
						<view style="display: flex;flex-direction: column;">
							<text style="font-size: 40rpx;color: #f85063;display: block;font-weight: 600;">{{ userIndex.good?userIndex.good:0 }}</text>
							<text style="font-size: 20rpx;color: #bcc5d2;text-align: center;">获赞</text>
						</view>
					</view>
				</u-col>
				<u-col span="4">
					<view class="flexCenter">
						<view style="display: flex;flex-direction: column;">
							<text style="font-size: 40rpx;color: #5466ff;display: block;font-weight: 600;">{{ userIndex.myFollow?userIndex.myFollow:0 }}</text>
							<text style="font-size: 20rpx;color: #bcc5d2;text-align: center;">关注</text>
						</view>
					</view>
				</u-col>
				<u-col span="4">
					<view class="flexCenter">
						<view style="display: flex;flex-direction: column;">
							<text style="font-size: 40rpx;color: #ffca12;display: block;font-weight: 600;">{{ userIndex.followMe?userIndex.followMe:0 }}</text>
							<text style="font-size: 20rpx;color: #bcc5d2;text-align: center;">粉丝</text>
						</view>
					</view>
				</u-col>
			</u-row>
		</view>
		<view style="width: 660rpx;height: 2rpx;background-color: #f2f3f9;margin: 20rpx auto;"></view>
	</view>
</template>

<script>
	// import { Community } from '../../model/community';
	export default {
		data() {
			return {
				userIndex:"",
				loading:true,
			};
		},
		props:['Id','isGo','userInfo'],
		mounted() {
			// const userInfo = uni.getStorageSync('userInfo');
			// this.userInfo = userInfo;
		},
		
		methods:{
			clickSetting(){
				uni.navigateTo({
					url:"/pages/my/set"
				})
			},
			goInfo(){
				if(this.isGo){
					uni.navigateTo({
						url:"./info"
					})
				}else{
					uni.previewImage({
						urls:[this.userIndex.userInfo.avatar],
						current:0
					})
				}
			},
		},
	}
</script>

<style lang="scss">
.header{
		width: 100%;
		height: 150rpx;
		margin-top: 58rpx;
	}
	.myLimit{
		height: 100%;
		width: 660rpx;
		margin: 0 auto;
	}
	.sign{
		color: rgba(0,0,0,0.60);
		margin-bottom: 51rpx;
		margin-top: 27rpx;
	}
	.headerInfoRight{
		flex: 1;
		position: relative;
	}
	.setting{
		position: absolute;
		right: 10rpx;
		top:25rpx
	}
</style>
